<template>
  <view>
    <Goods v-for="(item, index) in goodsList" :key="index" :item="item" :goodsId="item.skuId">
    </Goods>
    <CartsIcon></CartsIcon>
  </view>
</template>

<script>
import { getFootprint } from '@/api/personalCenter/index.js'
import Goods from '@/components/goods/goods.vue'
import CartsIcon from '@/components/home/cartsIcon.vue'

export default {
  components: { Goods, CartsIcon },
  data() {
    return {
      pageNumber: 1,
      pageSize: 30,
      pages: 0,
      goodsList: []
    }
  },
  // 监听触底
  onReachBottom() {
    if (this.pages > this.pageNumber) {
      this.pageNumber++
      this.getData()
    }
  },
  onLoad() {
    this.getData()
  },
  methods: {
    getData() {
      getFootprint({ pageNumber: this.pageNumber, pageSize: this.pageSize }).then(res => {
        if (res.code === 200) {
          this.goodsList.push(...res.data.records)
          this.pages = res.data.pages
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped></style>
